<template>
  <div>
    <div class="app-content">
      <el-tabs v-model="tabName" v-loading="loading" class="config-tab">
        <el-tab-pane v-for="(item, key) in tabs" :key="key" :label="item.label" :name="item.key">
          <config-form v-if="item.key === tabName" :config-key="item.key" />
        </el-tab-pane>
        <!--        <el-tab-pane v-if="level >= 2" key="douyinMinAppOpen" name="douyinMinAppOpen" label="抖音小程序服务商">-->
        <!--          <min-app-open-list v-if="tabName === 'douyinMinAppOpen'" type="dy" />-->
        <!--        </el-tab-pane>-->
      </el-tabs>
    </div>
  </div>
</template>

<script>
import ConfigForm from './components/ConfigForm/ConfigForm.vue'
import { getConfigList } from '@/api/system/config'
import MinAppOpenList from '@/views/backend/setting/config/components/MinAppOpenList/index.vue'

export default {
  components: {
    // MinAppOpenList,
    ConfigForm
  },
  data() {
    return {
      tabName: 'site',
      tabs: [],
      level: 0,
      loading: true
    }
  },
  mounted() {
    getConfigList().then((res) => {
      this.tabs = res.data.filter((item) => {
        if (!item.is_hide || this.$route.query.show) {
          return item
        }
      })
      this.level = res.other
      this.loading = false
    })
  },
  methods: {}
}
</script>
<style scoped lang="scss">
.config-tab {
  min-height: 400px;
}
</style>
